<%@ page contentType="text/html;charset=UTF-8" %>
<%@ include file="/WEB-INF/views/include/taglib.jsp"%>
<html>
<head>
    <title>物业缴费</title>
    <meta name="decorator" content="default"/>
    <script type="text/javascript" src="${ctxStatic}/supcan/ajaxSet.js"></script>
    <script>
        var isok=1;
        $(function(){
            var date = new Date();
            var strDate=date.getDate();
            if(strDate>0&&strDate<=10){
                $("#one").show();
                $("#two").show();
                $("#three").show();
                $("#isDelete").val(1);
                $("#fee").html("2.5");
                $("#isActive").attr("checked",true);
            }else{
                $("#four").show();
                $("#five").show();
                $("#six").show();
                $("#isDelete").val(0);
                $("#fee").html("2.5");
                $("#isActive").attr("checked",false);
            }
            $("#buildNum").change(function(){
                var buildNum=$("#buildNum").val();
               // alert(buildNum);
                $.ajax({
                    type : "POST",
                    url : "${ctx}/sys/manageTenenment/showUnitNoList",
                    data : {
                        buildNum : buildNum
                    },
                    success : function(data) {
                        closeTip();
                     //   alert(data);
                        data=eval(data);
                        var str = "<option>请选择单元</option>";
                        $("#unitNo").html("");
                        for ( var i = 0; i < data.length; i++) {
                            str += "<option value='"+data[i].unitNo+"'>" + data[i].unitNo + "</option>";
                        }
                        $("#unitNo").append(str);
                    }
                });



            });
            $("#unitNo").change(function(){
                var buildNum=$("#buildNum").val();
                var unitNo=$("#unitNo").val();
              //  alert(buildNum);
               // alert(unitNo);
                $.ajax({
                    type : "POST",
                    url : "${ctx}/sys/manageTenenment/showDoorNoList",
                    data : {
                        buildNum : buildNum,
                        unitNo:unitNo
                    },
                    success : function(data) {
                        closeTip();
                   //     alert(data);
                        data=eval(data);
                        var str = "<option>请选择门牌号</option>";
                        $("#showName").html("");
                        for ( var i = 0; i < data.length; i++) {
                            str += "<option value='"+data[i].showName+"'>" + data[i].showName + "</option>";
                        }
                        $("#showName").append(str);
                    }
                });


                });
            $("#showName").change(function(){
                var buildNum=$("#buildNum").val();
                var unitNo=$("#unitNo").val();
                var showName=$("#showName").val();
              //  alert(buildNum);
              //  alert(unitNo);
                $.ajax({
                    type : "POST",
                    url : "${ctx}/sys/manageTenenment/OneTenement",
                    data : {
                        buildNum : buildNum,
                        unitNo:unitNo,
                        showName:showName
                    },
                    success : function(data) {
                        closeTip();
                     //   alert(data);
                        data=eval(data);
                        for ( var i = 0; i < data.length; i++) {
                            //賦值
                            $("#uid").val(data[0].uid);
                            $("#id").val(data[0].id);
                            $("#coveredArea").val(data[0].coveredArea);
                            $("#propertyFee").val(data[0].propertyFee);
                            $("#buildingNo").val(data[0].buildingNo);
                            //金額
                            var mon = data[0].coveredArea * data[0].propertyFee;
                            $("#money1").html(mon.toFixed(2));
                            //如果在十号之前可以参与活动进行返现，如果不是则不显示参与活动页面
                            if(strDate>0&&strDate<=10){
                                $("#isDelete").val(1);
                                $("#fee").html("");
                                $("#fee").html(data[0].buildingNo.toFixed(2));
                                var monf= data[0].coveredArea * data[0].propertyFee*data[0].buildingNo;
                                $("#money2").html(monf.toFixed(2));
                                $("#money").val(monf);
                                $("#isActive").val(1);
                            }else{
                                $("#money").val(mon);
                                isok=2;
                                $("#isActive").val(0);
                            }


                        }
                    }
                });

            });
        });
        //计算缴费金额
    function mult(obj){
      //  alert(obj);
        var isDelete=$("#isDelete").val();
        var coveredArea=$("#coveredArea").val();
        var propertyFee=$("#propertyFee").val();
        var buildingNo=$("#buildingNo").val();
        var mon = coveredArea* propertyFee*obj;
        var monf = coveredArea* propertyFee* buildingNo*obj;
       // alert(monf);
        var date = new Date();
        var strDate=date.getDate();
        if($("input[type='checkbox']").is(':checked')){
                $("#money1").html("");
                $("#money2").html("");
                $("#money1").html(mon.toFixed(2));
                $("#money2").html(monf.toFixed(2));
                $("#money").val(monf);
                $("#isActive").val(1);


        }else{
           // alert(mon+"============not");
            $("#money1").html("");
            $("#money2").html("");
            $("#money1").html(mon.toFixed(2));
            $("#money2").html(mon.toFixed(2));
            $("#money").val(mon);
            $("#isActive").val(0);
        }

    }
    </script>
    <script type="text/javascript">

        $(document).ready(function() {
            $("#phone").blur(function(){
                if($("#phone").val()==""){
                    $("#pp").html("请填写手机号");
                }else{
                    $("#pp").html("*");
                }
            });
            $("#inputForm").validate({
                rules:{
                 //   commName: {remote: "${ctx}/sys/community/checkCommName?oldCommName=" + encodeURIComponent('${tbCommunity.commName}')},
                    buildNum:{
                        required:true,
                        buildNum:"buildNum"
                    },
                    unitNo :{
                        required:true,
                        unitNo:"unitNo"
                    },
                    showName :{
                        required:true,
                        showName:"showName"
                    }
                },
             /*  messages: {
                    commName: {remote: "该小区名称已存在"}
                },*/
                submitHandler: function(form){
                    //alert($("#phone").val()+"============");
                    if($("#phone").val()==""){
                       // alert("no");
                        $("#pp").html("请填写手机号");
                        var mm=$("input[name='month']:checked").val();
                        var date = new Date();
                        var strDate=date.getDate();
                        if(mm>1&&strDate>10){
                            alert('10号以后只能交一个月的物业费！');
                        }else{
                            if(isok==2){
                                loading('正在提交，请稍等...');
                                form.submit();
                                closeTip();
                            }
                        }

                    }else{
                       // alert("yes");
                        loading('正在提交，请稍等...');
                        form.submit();
                        closeTip();
                    }

                },
                errorContainer: "#messageBox",
                errorPlacement: function(error, element) {
                    $("#messageBox").text("输入有误，请先更正。");
                    if (element.is(":checkbox")||element.is(":radio")||element.parent().is(".input-append")){
                        error.appendTo(element.parent().parent());
                    } else {
                        error.insertAfter(element);
                    }
                }
            });
            $.validator.addMethod("buildNum",function(values,elements){
                if(values=="请选择楼号"){
                    var tt=document.getElementById("tt");
                    tt.innerHTML="请选择楼号";
                    return false;
                }else{
                    var tt=document.getElementById("tt");
                    tt.innerHTML="*";
                    return true;
                }
            },"");
            $("#buildNum").change(function(){
                var tt=document.getElementById("tt");
                tt.innerHTML="*";
            });
            $.validator.addMethod("unitNo",function(values,elements){
                if(values=="请选择单元号"){
                    var tt=document.getElementById("tt");
                    tt.innerHTML="请选择单元号";
                    return false;
                }else{
                    var tt=document.getElementById("tt");
                    tt.innerHTML="*";
                    return true;
                }
            },"");
            $("#unitNo").change(function(){
                var tt=document.getElementById("tt");
                tt.innerHTML="*";
            });
            $.validator.addMethod("showName",function(values,elements){
                if(values=="请选择门牌号"){
                    var tt=document.getElementById("tt");
                    tt.innerHTML="请选择门牌号";
                    return false;
                }else{
                    var tt=document.getElementById("tt");
                    tt.innerHTML="*";
                    return true;
                }
            },"");
            $("#showName").change(function(){
                var tt=document.getElementById("tt");
                tt.innerHTML="*";
            });
        });
    </script>
    <script type="text/javascript">
        $(function() {
            $(':checkbox').click(function(){
                var obj=$("input[name='month']:checked").val();
               // alert(obj+"==month");
                mult(obj);
            });
        });
    </script>
</head>
<body>
<ul class="nav nav-tabs">
    
    <li class="active"><a href="${ctx}/sys/manageTenenment/tenementMoney">物业缴费</a></li>
</ul><br/>
<form:form id="inputForm" modelAttribute="tbUserTenementInfo" action="${ctx}/sys/manageTenenment/tenementMoney" method="post" class="form-horizontal">
    <span><font style="color: #00A6C7">${message1}</font></span>
    <span><font style="color: #00A6C7">${message2}</font></span>
    <form:hidden path="id" id="id"/>
    <form:hidden path="isActive" id="isActive"/>
    <form:hidden path="uid" id="uid"/>
    <form:hidden path="money" id="money"/>
    <form:hidden path="coveredArea" id="coveredArea"/>
    <form:hidden path="propertyFee" id="propertyFee"/>
    <form:hidden path="buildingNo" id="buildingNo"/>
    <form:hidden path="isDelete" id="isDelete" value="2"/>


    <div class="control-group">
        <label class="control-label">住址：</label>
        <div class="controls">
            <span>
                <select id="buildNum" name="buildNum" class="input-medium">
                    <option>请选择楼号</option>
                    <c:forEach items="${buildNumList}" var="bul">
                        <option value="${bul.buildNum}">${bul.buildNum}</option>
                    </c:forEach>
                </select>
            </span>
            &nbsp;&nbsp;
            <span>
                <select id="unitNo" name='unitNo' class="input-medium">
                     <option >请选择单元号</option>

                </select>
            </span>
            &nbsp;&nbsp;
            <span>
                <select id="showName" name='showName' class="input-medium required">
                      <option selected>请选择门牌号</option>
                </select>
            </span>
            <span class="help-inline"><font color="red" id="tt">*</font> </span>
        </div>
    </div>
    <div class="control-group">
        <label class="control-label">类型:</label>
        <div class="controls">
            <form:radiobutton path="tenementType" value="1" checked="true"/>缴费
        </div>
    </div>
    <div class="control-group">
        <label class="control-label">时间:</label>
        <div class="controls">
            <form:radiobutton path="month" onclick="mult(1)" value="1" checked="true"/>一个月
            <form:radiobutton path="month" onclick="mult(2)" value="2"/>二个月
            <form:radiobutton path="month" onclick="mult(3)" value="3" />三个月
            <form:radiobutton path="month" onclick="mult(6)" value="6" />半年
        </div>
    </div>

    <div class="control-group">
        <label class="control-label">物业费:</label>
        <div class="controls">
            <span class="help-inline"><font id="money1"></font> </span><br/>
        </div>

    </div>
    <div id="one" class="control-group"  style="display: none;">
        <label class="control-label">是否参与活动:</label>
        <div class="controls">
            <form:checkbox path="isDelete"    value="1" id="isActive"/>参加返现活动（参与活动后会给物业钱包增加物业费* <span class="help-inline"><font id="fee"></font> </span><br/>倍的金额，可用于购物)<br/>
            10号之后无法参与活动
        </div>
    </div>
    <div id="two" class="control-group" style="display: none;">
        <label class="control-label">应付金额:</label>
        <div class="controls">
            <span class="help-inline"><font id="money2"></font> </span><br/>
        </div>
    </div>
    <!--  style="display: none;" -->
    <div id="three" class="control-group"  style="display: none;">
        <la1bel class="control-label">麻雀手机号:</la1bel>
        <div class="controls">
            <form:input path="mobile" htmlEscape="false" maxlength="100" class="phone" id="phone"/><font color="red" id="pp">*</font>
        </div>
    </div>
    <div id="four" class="control-group"  style="display: none;">
        <label class="control-label">是否参与活动:</label>
        <div class="controls">
            <form:checkbox path="isDelete"  disabled="true"  value="1" id="isActive"/>参加返现活动（参与活动后会给物业钱包增加物业费* <span class="help-inline"><font id="fee"></font> </span><br/>倍的金额，可用于购物)<br/>
            10号之后无法参与活动
        </div>
    </div>
    <div id="five" class="control-group" style="display: none;">
        <label class="control-label">应付金额:</label>
        <div class="controls">
            <span class="help-inline"><font id="money3"></font> </span><br/>
        </div>
    </div>
    <!--  style="display: none;" -->
    <div id="six" class="control-group"  style="display: none;">
        <la1bel class="control-label">麻雀手机号:</la1bel>
        <div class="controls">
            <form:input path="mobile" htmlEscape="false" disabled="true" maxlength="100" class="phone" id="phone"/><font color="red" id="pp">*</font>
        </div>
    </div>
    <div class="form-actions">
       <input id="btnSubmit" class="btn btn-primary" type="submit" value="保 存"/>&nbsp;
        <input id="btnCancel" class="btn" type="button" value="返 回" onclick="history.go(-1)"/>
    </div>
</form:form>
</body>
</html>